<template>
  <div id="app" class="moments">
    <div class="files-title">
      <h3>精彩瞬间统计</h3>
      <p>{{ searchData.stuName }} 在 {{ searchData.semesterName }} 精彩瞬间 <span>{{momentNum}} 次</span></p>
    </div>
    <line-bar ref="lineBar" :chartData="chartData" :YAxis="YAxis"  v-on="$listeners"></line-bar>
  </div>
</template>
<script>
import { StudengFiles } from '@/utils/skStudentFilesMixin.js'
import LineBar from '../modules/line-bar.vue'
export default {
  name: 'moments',
  mixins:[StudengFiles],
  data() {
    return {
      url: {
        query: '/health/record/getStudentRecordByMonth'
      },
      
      chartData: [
        {
          legendTitle: '精彩瞬间次数',
          type: 'line',
          color: ['#F58080']
        }
      ],
      YAxis: [
        {
          name: '次',
          position: 'left'
        }
      ],
      momentNum:0
    }
  },
  components: {
    LineBar
  },
  props: ['dataForm', 'semesterName', 'className'],
  filters: {},

  computed: {},

  created() {},

  activated() {},


  methods: {
    // /查看单个幼儿数据
    async initStudentChart() {
      let data = await this.queryData();
      let categorys = [],xData = [];
      const monthColumns = this.dataForm.daysColums;
      let arr1 = [];
      this.momentNum = 0
      for(let rowIndex = 0; rowIndex < monthColumns.length; rowIndex++){
        const rowString = monthColumns[rowIndex].toString();
        categorys.push(rowString);
        const monthData = data.find(item => item.month == rowString);
        if (monthData){
          arr1.push(monthData.num)
          this.momentNum += monthData.num
        } else {
          arr1.push(0)
        }
      }
      xData.push(arr1)
      this.$refs.lineBar.initEChart(categorys,xData)
    }
  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
@import url(~@/assets/less/studentFiles.css); 
</style>
